<div id="contentContainer" data-ng-controller="ControllerDashboard">
    <div id="dashboardContent">
        <section id="sectionAdministration" class="clearfix">
            <a href="/usuarios/voluntario" class="statistic"><span>{{countVolunteers}}</span> Voluntarios</a>
            <a href="/usuarios/aliado" class="statistic"><span>{{countAllies}}</span> Aliados</a>
            <a href="/eventos" class="statistic"><span>{{countEvents}}</span> Eventos</a>
            <canvas id="canvasAnimation" width="960" height="320" style="background-color:#FFFFFF"></canvas>
        </section>
    </div>
    <div data-ng-controller="ControllerEvents" data-ng-init="init()">
        <h2 class="flag">Eventos</h2>

        <ul id="gridEvents" class="grid">
            <li data-ng-repeat="event in events" class="cols-4">
                <a href="/evento/{{event.id}}">
                    <img src="/styles/images/event_kind{{event.kind[0].id}}.png" alt="{{event.name}}"/>

                    <div class="info">
                        <div class="flag"><span class="big">{{event.usermin}}</span> voluntarios necesarios</div>
                        <h3 class="title">{{event.name}}</h3>
                    </div>
                <span data-ng-if="!isCreator(event.creator) && !event.isEnrolled"
                      class="label interactionAlt right">Únete</span>
                    <span class="label action right" data-ng-if="event.isEnrolled && !isCreator(event.creator)">Registrado</span>
                </a>
                <button data-ng-click="deleteEvent(event.id)" data-ng-if="isCreator(event.creator)" class="right">Eliminar
                </button>
            </li>
        </ul>
    </div>
    <h2 class="flag">Noticias</h2>
    <ul class="newsList">
        <li>
            <img src="/styles/images/default_icon.png" />
            <div class="news">
                <h3>Título de la noticia</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ut felis tempor, volutpat leo eu, tempus orci. Mauris tristique non nibh nec condimentum. Integer nibh dolor, auctor a lacus sed, tristique placerat odio. Pellentesque nec nibh quis lectus hendrerit porta id eget augue. Sed interdum massa ut bibendum posuere. Vestibulum in massa nec mauris finibus imperdiet eu sed tellus. Praesent at fermentum nunc, id semper lacus. Aenean accumsan justo eu fermentum porta. Nulla a nibh sed elit dignissim ultricies. Nullam volutpat ullamcorper eros, elementum finibus odio placerat lobortis. Aliquam quis risus at magna suscipit vestibulum vitae nec felis. Maecenas a mauris venenatis, condimentum lorem sed, laoreet tellus.</p>
            </div>
        </li>
        <li>
            <img src="/styles/images/default_icon.png" />
            <div class="news">
                <h3>Título de la noticia</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ut felis tempor, volutpat leo eu, tempus orci. Mauris tristique non nibh nec condimentum. Integer nibh dolor, auctor a lacus sed, tristique placerat odio. Pellentesque nec nibh quis lectus hendrerit porta id eget augue. Sed interdum massa ut bibendum posuere. Vestibulum in massa nec mauris finibus imperdiet eu sed tellus. Praesent at fermentum nunc, id semper lacus. Aenean accumsan justo eu fermentum porta. Nulla a nibh sed elit dignissim ultricies. Nullam volutpat ullamcorper eros, elementum finibus odio placerat lobortis. Aliquam quis risus at magna suscipit vestibulum vitae nec felis. Maecenas a mauris venenatis, condimentum lorem sed, laoreet tellus.</p>
            </div>
        </li>
    </ul>
<script src="/libs/easeljs-0.7.1.min.js"></script>
<script src="/libs/tweenjs-0.5.1.min.js"></script>
<script src="/libs/movieclip-0.7.1.min.js"></script>
<script src="/libs/preloadjs-0.4.1.min.js"></script>
<script src="/js/appoyaHome.js"></script>
<script type="text/javascript">
    $(function(){
        var canvas, stage, exportRoot;
        function init() {
            canvas = document.getElementById('canvasAnimation');
            var images = images || {};

            var loader = new createjs.LoadQueue(false);
            loader.addEventListener("fileload", handleFileLoad);
            loader.addEventListener("complete", handleComplete);
            loader.loadManifest(lib.properties.manifest);
        }

        function handleFileLoad(evt) {
            if (evt.item.type == "image") {
                images[evt.item.id] = evt.result;
            }
        }

        function handleComplete() {
            exportRoot = new lib.appoyahome();

            stage = new createjs.Stage(canvas);
            stage.addChild(exportRoot);
            stage.update();

            createjs.Ticker.setFPS(lib.properties.fps);
            createjs.Ticker.addEventListener("tick", stage);
        }
        $(document).ready(function(){
            init();
        });
    });

</script>
</div>